<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>JavaScript专题之跟着 underscore 学节流</title>
	<style type="text/css">
		#container {
			height: 200px;
			line-height: 200px;
			text-align: center;
			color: #fff;
			font-size: 30px;
			background-color: #666;
		}
	</style>
</head>
<body>
	<h1>JavaScript专题之跟着 underscore 学节流</h1>
	<div id="container"></div>


<script>
var count = 0;
var container = document.getElementById('container');
function getUserAction(e) {
	container.innerHTML = count++;
}

// 节流：如果你持续触发事件，每隔一段时间，只执行一次事件

// 第一种：时间戳

//
function throttle(func, wait) {
	var context, args;
	var previous = 0;

	return function() {
		var now = +new Date();
		context = this;
		args = arguments;
		if(now - previous > wait) {
			func.apply(context, args);
			previous = now;
		}
	}
}
container.onmousemove = throttle(getUserAction, 1000);

</script>
</body>
</html>